<!--
 * @Author: ITDLCL
 * @Date: 2024-11-16 17:24:24
 * @LastEditors: ITDLCL
 * @Description:
-->
<!-- 核销确认 -->
<template>
  <view class="">
    <PageWarpper page-name="订单核销">
      <template v-slot:main>
        <!--核销-->
        <view class="check">
          <view class="check_method border-top border-bottom">
            <label class="name siyuan-medium border-bottom">核销券码</label>
            <view class="input-code border-bottom">
              <input
                type="text"
                v-model="code"
                placeholder="请输入订单编号"
                placeholder-class="placeholder-text"
                class="siyuan-medium"
              />
            </view>
            <button class="black-btn" @click="vertifyClick">确认核销</button>
          </view>
          <view class="check_method border-bottom">
            <label class="name siyuan-medium border-bottom">二维码核销</label>
            <view class="scan">
              <image
                src="https://bac-miniprogram.oss-cn-beijing.aliyuncs.com/images/icon/scan_icon.png"
                mode="widthFix"
              ></image>
              <button @tap="getScancode">扫一扫</button>
            </view>
          </view>
        </view>
      </template>
    </PageWarpper>
    <FooterBar :tab-index="2" />
  </view>
</template>

<script setup>
import PageWarpper from "@/components/Layer/PageWarpper.vue";
import FooterBar from "@/components/FooterBar/index.vue";
import { orderVerifyByOrderNo } from "@/server/api.js";
import { ref } from "vue";

let code = ref(""); // 券码

// 扫一扫
let getScancode = () => {
  uni.scanCode({
    success: res => {
		console.log('获取核销的数据',res,'66666')
		if (res.result) {
			uni.navigateTo({
			  url: "/pages/personal/checkverify?orderNo=" + res.result,
			});
		}
    },
    fail(res) {
      console.log(res);
    },
  });
};

let vertifyClick = () => {
  if (!code.value) {
    uni.showToast({
      title: "请输入订单编号",
      icon: "none",
    });
    return;
  }
  orderVerifyByOrderNo({
    orderNo: code.value,
  }).then(res => {
    if (res.data.status) {
      uni.showToast({
        title: "核销成功",
        icon: "none",
      });
      code.value = "";
    } else {
      uni.showToast({
        title: res.data.reason,
        icon: "none",
      });
    }
  });
};
</script>

<style lang="scss" scoped>
.check_method {
  .name {
    padding: 22rpx 0;
    background-color: #f2f2f2;
    display: block;
    font-size: 26rpx;
    text-align: center;
  }
  .input-code {
    padding: 32rpx 0;
    background-color: #ffffff;
    input {
      font-size: 26rpx;
      text-align: center;
    }
  }
  .scan {
    position: relative;
    background-color: #ffffff;
    text-align: center;
    image {
      width: 90rpx;
      margin: 52rpx auto 52rpx;
      display: block;
    }
    button {
      position: absolute;
      left: 50%;
      top: -45rpx;
      margin-left: -90rpx;
	  margin-top: 0;
      width: 90px;
      height: 90px;
      opacity: 0;
      filter: alpha(opacity=0);
    }
  }
  button {
    margin-top: 100rpx;
    margin-bottom: 100rpx;
    width: 238rpx;
    height: 102rpx;
    line-height: 102rpx;
  }
}
</style>
